<template>
  <view class="container">
    <!-- 顶部显示学号和姓名 -->
    <view class="top-info">学号：你的学号  姓名：你的姓名</view>
    <!-- 注册表单 -->
    <form>
      <view class="form-item">
        <label>用户名：</label>
        <input type="text" v-model="username" placeholder="请输入用户名" />
      </view>
      <view class="form-item">
        <label>密码：</label>
        <input type="password" v-model="password" placeholder="请输入密码" />
      </view>
      <view class="form-item">
        <label>性别：</label>
        <radio-group v-model="gender">
          <radio :value="1">男</radio>
          <radio :value="2">女</radio>
        </radio-group>
      </view>
      <view class="form-item">
        <label>出生日期：</label>
        <picker mode="date" :value="birthday" @change="onBirthdayChange">
          <view class="picker">
            {{ birthday }}
          </view>
        </picker>
      </view>
      <view class="form-item">
        <button type="primary" @click="register">注册</button>
      </view>
    </form>
  </view>
</template>

<script>
export default {
  data() {
    return {
      username: '',
      password: '',
      gender: '',
      birthday: ''
    };
  },
  methods: {
	  toRegister(){
		  uni.navigateTo({
		  	url:'/'
		  })
	  },
    onBirthdayChange(e) {
      this.birthday = e.detail.value;
    },
    register() {
      // 这里可以添加注册逻辑，比如向后端发送请求等
      uni.showToast({
        title: '注册成功',
        icon: 'success'
      });
    }
  }
};
</script>

<style scoped>
.container {
  padding: 20rpx;
}
.top-info {
  margin-bottom: 30rpx;
  font-size: 32rpx;
}
.form-item {
  margin-bottom: 30rpx;
  display: flex;
  align-items: center;
}
.form-item label {
  width: 150rpx;
}
.picker {
  border: 1px solid #eee;
  padding: 10rpx;
  border-radius: 4rpx;
}
</style>